<template>
  <Header title="地址管理"> </Header>
  <van-address-list
    v-model="chosenAddressId"
    :list="list"
    default-tag-text="默认"
    @add="onAdd"
    @edit="onEdit"
  />
</template>

<script setup>
import { onMounted, ref } from "vue";
import Header from "../home/components/Header.vue";
import { useCartStore } from "../../store/CartSore";
import { useRouter } from "vue-router";
const router = useRouter();
const cartStore = useCartStore();
const onAdd = () => {
  router.push({
    path:"/addressEdit",
    query:{
      type:"add"
    }
  });
};
const onEdit = (item) => {
  router.push({
    path: "/addressEdit",
    query: {
      id: item.id,
      type: "edit",
    },
  });
};
const list = ref([]);
const chosenAddressId = ref("1");
const init = () => {
  list.value = cartStore.userAddress.map((item) => {
    return {
      id: item.id,
      name: item.name,
      tel: item.tel,
      address: `${item.province}${item.city}${item.county}${item.addressDetail}`,
      isDefault: item.isDefault,
    };
  });
};
onMounted(() => {
  init();
});
</script>

<style scoped lang="less">
/deep/.van-button--primary {
  background-color: #ffc400;
  border-color: #ffc400;
}
/deep/.van-switch--on {
  background-color: #ffc400;
}
/deep/.van-radio__icon {
  display: none;
}
</style>
